import React, { useEffect, useState } from "react";
import { useBoolean, useRequest } from "ahooks";
import { Divider, message } from "antd";

import Config from "./config";
import Show from './show';
import BatchProcess from "./batch-process";
import * as APIS from '../../../constants/api-constants';


export default () => {
  const [companyList, setCompanyList] = useState<CM.CompanyShow[]>([]);
  const [page, setPage] = useState(1);
  const [total, setTotal] = useState(0);
  const [isFresh, { setTrue: setFresh, setFalse: noFresh }] = useBoolean(true);
  const [name, setName] = useState(''); // 筛选查询企业名称
  const [medicalField, setMedicalField] = useState(''); // 筛选医疗领域

  /**
   * 获取首页 table
   */
  const { run: requestCompanyList, loading } = useRequest((
    currentPage,
    pageSize,
    searchName,
    searchMedicalField
  ) => {
    return {
      url: APIS.COMPANY,
      method: 'GET',
      params: {
        page: currentPage,
        pageSize,
        name: searchName,
        medicalField: searchMedicalField
      },
    };
  }, {
    manual: true,
    debounceInterval: 500,
    onSuccess: (result) => {
      const { companyList: tableProps, total } = result.data.mainData;
      setCompanyList(tableProps);
      setTotal(total);
      setPage(1);
      noFresh();
    },
    onError: () => {
      message.error('服务器异常，请稍后再试');
      console.log('onError');
    },
  });

  useEffect(() => {
    if (isFresh) {
      requestCompanyList(page, 10, name, medicalField);
    }
  }, [page, isFresh, requestCompanyList, name, medicalField])

  return (
    <>
      <Config
        setName={setName}
        setMedicalField={setMedicalField}
        setFresh={setFresh}
      />
      <Divider orientation='left' />
      <BatchProcess setFresh={setFresh}  />
      <Show
        tableProps={companyList}
        setPage={setPage}
        setFresh={setFresh}
        total={total}
        listloading={loading}
        setTotal={setTotal}
      />
    </>
  );
}

